<template>
	<view class="count">
		<view class="list">
			<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="onreachBottom">
				<view v-for="(item,index) in list" :key="index" class="item f f-a-c f-j-b">
					<view class="time">
						{{$u.timeFormat(item.recorded_time, 'yyyy-mm-dd hh:MM')}}
					</view>
					<view class="rigNum">
						{{item.weight}}kg
					</view>
				</view>
			</scroll-view>
		</view>
		<view v-if="list.length==0" class="zanwu">
			暂无记录
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				page: 1,
				total: 0
			}
		},
		onShow() {
			this.page = 1
			this.list = []
			this.initList()
		},
		methods: {
			async initList() {
				let n = await this.$api.trendList({
					pet_id: uni.getStorageSync('catId'),
					page: this.page,
					limit: 30
				})
				this.list = [...this.list, ...n.data.rows]
				this.total = n.data.total

			},
			onreachBottom() {
				if (this.total > this.list.length) {
					this.page++
					this.initList()
				}

				console.log('789456123');
			}
		}
	}
</script>

<style lang="scss" scoped>
	.zanwu {
		color: $brown;
		margin-top: 50%;
		text-align: center;
		font-weight: 600;
		font-size: 32rpx;
	}

	.list {
		max-height: 100%;
		width: 90%;
		margin: 0 auto;
		padding-top: 25rpx;
		overflow-y: auto;

		::-webkit-scrollbar {
			display: none;
		}

		.item {
			padding-bottom: 35rpx;
			border-bottom: 1rpx solid #f7f6f2;
			margin-top: 30rpx;

			.time {
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC-400;
				font-weight: 400;
				text-align: LEFT;
				color: $hui;
			}

			.rigNum {
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC-500;
				font-weight: 500;
				text-align: LEFT;
				color: $hei;
			}
		}
	}

	.count {
		height: 100vh;
		width: 100%;
		background-color: #fffefc;
	}
</style>